<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
  <title>로그인</title>
  <script src="/js/jquery-1.10.2.min.js"></script>
  <script>
    $(function () {
      var fLogin = $("#fLogin");
      var tId = $("#tId");
      var tPassword = $("#tPassword");
      var bSubmit = $("#bSubmit");
      var bCancel = $("#bCancel");
      var dMsg = $("#dMsg");

      tPassword.keypress(enterKeyPressed);
      tId.keypress(enterKeyPressed);
      bSubmit.click(submitForm);
      bCancel.click(clear);

      clear();

      function submitForm() {
        if ("" == tId.val()) {
          dMsg.html("<p>ID를 입력하지 않았습니다.</p>");
          tId.focus();

          return false;
        } else if ("" == tPassword.val()) {
          dMsg.html("<p>패스워드를 입력하지 않았습니다.</p>");
          tPassword.focus();

          return false;
        }

        var reqData = {};
        reqData.tId = tId.val().trim();
        reqData.tPassword = tPassword.val().trim();
        $.getJSON("/user/login.json", reqData , function (response, status) {
          var serverMsg = response.message;

          if ("success" != status || "login.internalServerError" == serverMsg) {
            dMsg.html("<p>서버에서 시스템 에러 발생!</p>");
            return false;
          }

          if ("login.invalidPassword" == serverMsg) {
            dMsg.html("<p>잘못된 패스워드 입력</p>");
            return false;
          }

          if ("login.invalidEmail" == serverMsg) {
            dMsg.html("<p>잘못된 E-Mail 입력</p>");
            return false;
          }

          if ("login.success" == serverMsg ) {
            dMsg.html("<p>로그인 성공</p>");
          }

        });
      }

      function enterKeyPressed(event) {
        if (13 == event.which) submitForm();
      }

      function clear() {
        tId.val("");
        tPassword.val("");
        dMsg.html("");
        tId.focus();
      }
    });
  </script>
</head>
<body>
  <div>
    <form id="fLogin">
      email:<input type="text" id="tId" name="tId"/><br/>
      password:<input type="password" id="tPassword" name="tPassword"/><br/>
      <input type="button" id="bSubmit" value="로그인"/>
      <input type="button" id="bCancel" value="초기화"/>
    </form>
  </div>
  <div id="dMsg"/>
</body>
</html>